{% extends 'basic_app/master.html' %}
{% block tag_left %}
    {% include 'basic_app/tag_left_user.html' %}
{% endblock %}
{% block userinfo %}
    <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
        <h2 class="page-header">本系统用户的管理页</h2>
        <div class="table-responsive" >
            <form class="navbar-form navbar-left" action="/basic_app/user_search"  role="search" method="post">
                {#                <button type="button" class="btn btn-default"><span class="glyphicon glyphicon-plus"  aria-hidden="true" ></span><a href="/basic_app/user_add"> 添加用户</a></button>#}
                <div class="form-group">
                    <input type="text" name="user_search" class="form-control" placeholder="Search">
                </div>
                <button type="submit" class="btn btn-default"><span class="glyphicon glyphicon-search" aria-hidden="true"></span> 搜索</button>
                <button type="button" class="btn btn-default" onclick="javascrtpt:window.location.href='/basic_app/user_add'"><span class="glyphicon glyphicon-plus"  aria-hidden="true" ></span> 添加用户</button>
            </form>
            <table class="table table-striped table-bordered table-hover">
                <thead>
                <tr>
                    {#                    <th>+</th>#}
                    <th>用户名</th>
                    <th>邮箱</th>
                    <th>手机号</th>
                    <th>部门</th>
                    <th>状态</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                {#                {%   for i in userinfo_result %}#}
                {%   for i in current_page %}
                    <tr>
                        {#                        <td><input type="checkbox"/></td>#}
                        <td style="display:none">{{ i.id }}</td>
                        <td>{{ i.username }}</td>
                        <td>{{ i.email }}</td>
                        <td>{{ i.iphone }}</td>
                        <td>{{ i.dept }}</td>
                        <td>{{ i.status }}</td>
                        <td><a href="/basic_app/user_edit?nid={{ i.id }}">编辑</a> | <a href="/basic_app/user_delete?nid={{ i.id }}">删除</a> | <a href="/basic_app/user_lock?nid={{ i.id }}">锁定</a> | <a href="/basic_app/user_more?nid={{ i.id }}" >查看详情</a></td>
                    </tr>
                {%  endfor %}
                </tbody>
            </table>
            {# 以下是分页  #}
            <div>
                <nav aria-label="Page navigation">
                    <ul class="pagination">

                        <li>
                            <a>每条显示
                            <select class="line_count " id ="line_count" line_count= {{  line_count }}  name="line_count">
                                <option>5</option>
                                <option>10</option>
                                <option>15</option>
                                <option>20</option>
                            </select>
                            <input type="button" onclick="aa_line()" class="line_count_a" value="确定"> </a>
                        </li>

                        {% if current_page.has_previous %}
                            <li>
                                <a href="/basic_app/user?page={{ current_page.previous_page_number }}&line_count={{ line_count  }}" aria-label="Previous">
                                    <span aria-hidden="true">上一页</span>
                                </a>
                            </li>
                        {% else %}
                            <li class="disabled">
                                <a href="" aria-label="Previous">
                                    <span aria-hidden="true">上一页</span>
                                </a>
                            </li>
                        {% endif %}
                        {# 拿到页码书总列表 #}
                        {% for item in  page_range %}
                            {% if current_page_num == item %}
                                <li class="active"><a href="/basic_app/user?page={{ item }}&line_count={{ line_count  }}">{{ item }}</a></li>
                            {% else %}
                                <li ><a href="/basic_app/user?page={{ item }}&line_count={{ line_count  }}">{{ item }}</a></li>
                            {% endif %}
                        {% endfor %}

                        {% if current_page.has_next %}
                            <li>
                                <a href="/basic_app/user?page={{ current_page.next_page_number }}&line_count={{ line_count  }}" aria-label="Next">
                                    <span aria-hidden="true">下一页</span>
                                </a>
                            </li>
                        {% else %}
                            <li class="disabled">
                                <a href="" aria-label="Previous">
                                    <span aria-hidden="true">下一页</span>
                                </a>
                            </li>
                        {% endif %}
                        <li class="disabled">
                            <a href="" aria-label="Previous">
                                <span aria-hidden="true">共 {{ paginator.num_pages }} 页 , {{ paginator.count }} 条 </span>
                            </a>
                        </li>

                    </ul>
                </nav>
            </div>
            {#  以上是分页 #}


        </div>
    </div>
{% endblock  %}
{% block script %}

    <script>
        function aa_line(){
            var line_count_set = $('.line_count').val();
            var   url="/basic_app/user?line_count="+line_count_set;
            window.location.href=url
        }
        window.onload=function(){
            var count_set = document.getElementById("line_count").getAttribute("line_count");
            document.getElementById("line_count").value=count_set}
    </script>

{% endblock %}